<template>
   <div class="box">
    <button @click="ShowTrue">显示弹框</button>
    <!--to: 插入到元素位置   disabled：根据true和false 判断是否插入 -->
   <Teleport to="body" :disabled="false">
    <Avue v-if="show" @On_show="getFalse"></Avue>
   </Teleport>
   </div>

</template>

<script setup lang="ts">
import Avue from '@/components/expame/A.vue';
import { ref } from 'vue';
const show = ref(false) 

const getFalse = (val)=>{
  show.value = val
}

const ShowTrue = ()=>{
    show.value =true
}
</script>

<style>
.box{
    position: relative;
    height: 50vh; 
    background-color: rgba(0, 255, 255, 0.349);

}

</style>